XPages: Scrollable viewPanel

HCL Notes/Domino 8.5 Forum (includes Notes Traveler)

Subject: XPages: Scrollable viewPanel - can it be done?

Feedback Type: Question

Product Area: Domino Designer on Eclipse (DDE)

Technical Area: Application Development

Platform: Windows

Release: 8.5.1

Reproducible: Always

On a viewPanel, I'd like to have the view data contained within a vertical scrollable region. I've been able to attach a scroll bar by wrapping the viewPanel in an <xp:panel> with a style of "overflow:auto" but I can't seem to get the View Column Headers to be outside of the scrolling region. The <xp:viewColumnHeader> tags are embedded/tied to the <xp:viewColumn> tags & if you try to separate them out, the view doesn't display at all. I also tried embedding the View Column Headers in the pager area à la the xp-key="headerPager" route, using raw HTML but the resulting headers were very tiny and didn't line up with the columns. Am I doomed to use pagers?

Maybe I'm not approaching this correctly. Has anyone been able to do this? Since these are categorized views, I haven't wanted to go down the "Use a Repeat control" route.

Thanks for any help.

My code:
<xp:panel id="viewDiv" styleClass="divScrollAuto"
style="overflow-x:hidden">
<xp:viewPanel rows="0" id="viewPanel1" viewStyle="width:100%"
pageName="/xpProduct.xsp" partialRefresh="true" value="#{view1}">

<xp:viewColumn columnName="Operation Division"
id="viewColumn1"
style="white-space:nowrap;font-weight:bold;color:rgb(0,64,0);width:100.0px"
collapsedImage="/collapseTwistie.gif" disableTheme="true"
indentResponses="true" expandedImage="/expandTwistie.gif">
<xp:viewColumnHeader id="viewColumnHeader1"
styleClass="viewColHeader textColHeader"
value="Operation Division">
</xp:viewColumnHeader>
</xp:viewColumn>

<xp:viewColumn columnName="Status" id="viewColumn2"
style="white-space:nowrap;font-weight:bold;color:rgb(128,64,64);width:50.0px"
expandedImage="/expandTwistie.gif"
collapsedImage="/collapseTwistie.gif" disableTheme="true"
indentResponses="true">
<xp:viewColumnHeader value="Status"
id="viewColumnHeader2" styleClass="viewColHeader textColHeader">
</xp:viewColumnHeader>
</xp:viewColumn>

(etc. ... )

<xp:viewColumn columnName="Project Leader" id="viewColumn7"
style="width:140px">
<xp:viewColumnHeader value="Project Leader"
id="viewColumnHeader7" styleClass="viewColHeader textColHeader">
</xp:viewColumnHeader>
</xp:viewColumn>
<xp:viewColumn id="viewColumn8" columnName="Project">
<xp:viewColumnHeader id="viewColumnHeader8"
value="Project" styleClass="viewColHeader textColHeader">
</xp:viewColumnHeader>
</xp:viewColumn>

</xp:viewPanel>
</xp:panel>

Feedback number JKIN88GLST created by ~Denise Zenfreetexjip on 08/19/2010

Status: Open
Comments: